MediaSource 支持

您所在的位置：网站首页 › mediasource不支持 iPhone › MediaSource 支持

MediaSource 支持

#MediaSource 支持 | 来源: 网络整理| 查看: 265

# MediaSource 支持

提示

mui-player.js 默认配合了 hls (opens new window)、flv (opens new window) 流媒体库，引用库文件即可播放指定的流媒体资源。同时你也可以配和其他 mse 库使用，通过 customKernel 配置对象来自定义编解码媒体，例如播放 mpd 文件配合 dash.js (opens new window)

# 使用 hls.js 或者 flv.js

使用 script 标签引入：

或者 node 使用模块管理器引入：

npm install hls.js --save npm install flv.js --save import Hls from 'hls.js' import Flv from 'flv.js' # 配置

在配置对象中添加 parse 声明指定视频编解码库

// 示例 hls 配置 var mp = new MuiPlayer({ container:document.getElementById("mui-player"), src:'http://ivi.bupt.edu.cn/hls/cctv1hd.m3u8', ... parse:{ type:'hls', loader:Hls, config:{ // hls config to：https://github.com/video-dev/hls.js/blob/HEAD/docs/API.md#fine-tuning debug:false, }, }, }); // 示例 flv 配置 var mp = new MuiPlayer({ container:document.getElementById("mui-player"), src:'https://flvplayer.js.org/assets/video/weathering-with-you.flv', ... parse:{ type:'flv', loader:Flv, // flv config to：https://github.com/Bilibili/flv.js/blob/HEAD/docs/api.md#flvjscreateplayer config:{ cors:true }, }, }); # 自定义使用MSE库

支持使用其他 mse 库进行编解码播放，这没有任何影响，只不过视频的编解码行为被完全托管，因此 muiplayer 不处理视频该如何播放。

customKernel 提供自定义处理视频编解码行为，一旦定义该该函数，那么视频的播放行为该完全由 customKernel 函数托管，type 属性定义视为无效。因此在视频发生错误或者销毁时，需要主动发送错误报告给 muiplayer 或者销毁 mse 释放内存！

import dashjs from 'dashjs' var dashDecodeAction = function(video,src) { let dashMedia = dashjs.MediaPlayer().create(); dashMedia.initialize(video, address.src,false); dashMedia.on(dashjs.MediaPlayer.events.ERROR,function(errMes) { console.error(errMes); // 发送错误报告 player.sendError(errMes); }) } // 示例使用 dash.js 播放 mpd 文件格式 var mp = new MuiPlayer({ container:'#mui-player', src:'https://dash.akamaized.net/envivio/EnvivioDash3/manifest.mpd', ... parse:{ customKernel:dashDecodeAction }, }); # Other Doc： Use Mp4 MediaSource (opens new window) MP4 MediaSource Demo (opens new window) Browser MediaSource Supported (opens new window) 帮助我们改善此页面！ (opens new window) 上次更新: 2021/7/10 上午1:35:50

← 移动端扩展【专业版】视频缩略图 →

【本文地址】

MediaSource 支持

MediaSource 支持

今日新闻

推荐新闻